// 基本颜色值
$white: #fdfdfd;
$black: #222222;

$gray: #cdcdcd;
$gray-light: #e6e6e6;
$gray-dark: #888888;

$red: #af0b0e;
$red-light: #d3191c;
$red-dark: #790000;

$green: #109216;
$green-light: #10ac18;
$green-dark: #08640d;

$blue: #15364d;
$blue-light: #2d5a86;
$blue-dark: #061e2e;

$pink: #ffa9b3;
$pink-light: #f36b7b;
$pink-dark: #dd4759;

$tiffany: #4ab7bd;
$tiffany-light: #65bfc4;
$tiffany-dark: #14898f;

$yellow: #fee471;
$yellow-light: #fdeea8;
$yellow-dark: #ecc71e;

$pan-green: #30b08f;

$color-border: #cdcdcd;

// 主菜单的背景色
$menuBg: #193141;
// 菜单文字颜色
$menuText: #cfdae7;
// 菜单文字颜色-激活状态
$menuActiveText: #2e96fd;
// 菜单悬停时
$menuHover: #327016;

// 子菜单的背景色
$subMenuBg: #0a1a24;
// 子菜单文字颜色-激活状态
$subMenuActiveText: #f4f4f5;
// 子菜单悬停时
$subMenuHover: #0d3550;

// 侧边栏的宽度
$barSideWidth: 21rem;
// 头部的高度
$headerHeight: 5rem;

// 设置一个统一的padding值
$wrapperPadding: 0.6rem;

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuBg: $menuBg;
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuActiveText: $subMenuActiveText;
  subMenuHover: $subMenuHover;
  barSideWidth: $barSideWidth;
  headerHeight: $headerHeight;
  wrapperPadding: $headerHeight;
}
